<template>
	<view class="Withdrawal">
		<!-- #ifdef APP-PLUS -->
		<Hearder :name="'转换'"></Hearder>
		<!-- #endif -->
		<view v-if="JSON.stringify(userinfo) !='{}'">
			<view class="topbox">
				<view>可提现门票</view>
				<view>{{userinfo.member_token}}</view>
			</view>
			<view class="tixianmoney bgbottom">
				<view>
					<input placeholder="请输入门票数量" placeholder-style="color:#ccc" v-model="amount"/>
				</view>
				<view @click="total">全部</view>
			</view>
			<view class="shouxufei bgbottom">
				<view>预计手续费({{userinfo.withdrawal.token_handling_fee}}%)</view>
				<view>￥{{amount * userinfo.withdrawal.token_price  * (userinfo.withdrawal.token_handling_fee/100)}}</view>
			</view>
			<view class="tixian" @click="withdraw">转换</view>
		</view>
		<Paypwd ref="paystatus" :totalprice="totalprice" @paymoney="paymoney"></Paypwd>
	</view>
</template>

<script>
	import Paypwd from '@/pages/common/paypwd.vue'
	export default {
		data(){
			return{
				amount:'',
				userinfo:{},
				totalprice:0
			}
		},
		onShow() {
			this.getMemberDetails()
		},
		methods:{
			// 获取个人信息
			getMemberDetails(){
				this.request('/member/getMemberDetails').then(res=>{
					if(res.data.code == 1){
						this.userinfo = res.data.data
					}
				})
			},
			// 梭哈
			total(){
				this.amount = this.userinfo.member_token
			},
			withdraw(){
				if(this.amount){
					this.request('/member/getIsPayPassword').then(res => {
						if(res.data.code==1){
							if(res.data.data==0){
								this.$refs.paystatus.payflag = true
							}else{
								this.$refs.paystatus.zhifuflag = true
							}
						}else{
							this.$tip(res.data.msg)
						}
					})
				}else{
					this.$tip("请输入门票数量")
				}
			},
			paymoney(){
				this.request('/token/toAccount',{num:this.amount}).then(res=>{
					if(res.data.code == 1){
						this.$tip(res.data.msg)
						this.amount=''
						this.$refs.paystatus.zhifuflag = false
						this.getMemberDetails()
					}else{
						this.$refs.paystatus.zhifuflag = false
						this.$tip(res.data.msg)
					}
				})
			},
		},
		components:{
			Paypwd
		}
	}
</script>

<style scoped lang="scss">
	.Withdrawal{
		.topbox{
			overflow: hidden;
			height: 212rpx;
			background: $uni-item-color;
			view{
				text-align: center;
				&:first-of-type{
					font-size: 26rpx;
					color: rgba(255,255,255,.8);
					margin-top: 46rpx;
				}
				&:last-of-type{
					font-size: 46rpx;
					color: #fff;
					font-weight: 800;
					margin-top: 20rpx;
				}
			}
		}
		.tixianmoney{
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 46rpx 4%;
			view{
				color: $uni-text-color;
				&:first-of-type{
					width: 80%;
					color: #323232;
					input{
						font-size: 34rpx;
					}
				}
			}
		}
		.shouxufei{
			display: flex;
			justify-content: space-between;
			padding: 40rpx 3%;
			view:last-of-type{
				color: $uni-text-color;
			}
		}
		.tixian{
			height: 88rpx;
			line-height: 88rpx;
			text-align: center;
			background: $uni-item-color;
			margin: 43rpx 3% 0;
			color: #fff;
			border-radius: 88rpx;
		}
	}
</style>